// 引入css
import '../assets/css/list.css'
import {Getgoods } from '../request/api'
import {Link} from 'react-router-dom'
import React from 'react'
class Home extends React.Component {
    constructor(){
        super()
        this.state={
            goodLists:[]
        }
    }
    componentDidMount(){
        Getgoods().then(res=>{
            // console.log(res,'right');
            console.log(res.list,'111');
            this.setState({
                goodLists:res.list
            },()=>{
                console.log(this.state.goodLists,'222');
            })
        })
    }
    render() {
        const {goodLists} = this.state
        return (<div className='good'>
           <div className='top'>
           <h1>商品列表</h1>
           </div>
          <div className='suo'>
          <input className='input' type="text" />
            <button className='btn'>搜索</button>
          </div>
          <h1 className='hearder'>
              <span>综合条件</span>
              <span>销量</span>
              <span>价格</span>
              <span>好评度</span>
              <span>店铺</span>
              <span>筛选</span>
          </h1>

          <h1 className='shai'>
              筛选11.11大促商品
          </h1>

          <div className='botto'>
              <ul>
                  
              {
                 goodLists.map(item=>{
                      return(
                    <div className='one' key={item.id}>
                    <div>
                        <Link to='/index/detail' state={{id:item.id,name:item.goodsname,price:item.price,market_price:item.market_price,img:item.img,type:1}}>
                        <img className='img' src={item.img} alt="" />
                        </Link>
                    </div>
                    <div className='right'>
                        <span className='xian'>限时</span>
                        <span className='name'>{item.goodsname}...</span>
                        <p>敏感肌可用,控痘祛痘,男女可用...</p>
                       <div className='le'>
                       <div className='xia'>
                            <span className='jia1'>&yen;{item.price}</span><br />
                            <span className='jia2'><del>&yen;{item.market_price}</del></span>
                            
                        </div>
                       
                        <div className='cart'>加入购物车</div>
                       
                       </div>
                    </div>
    
                 </div>)
                  })
              }
              </ul>
          </div>
           
        </div>)
    }
}
export default Home

